<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <!--<link rel="icon" href="%PUBLIC_URL%/favicon.ico"/>-->
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <meta name="theme-color" content="#000000"/>
    <meta
            name="description"
            content="Web site created using create-react-app"
    />
    <!--<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png"/>-->
    <!--
      manifest.json provides metadata used when your web app is installed on a
      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
    -->
    <!--<link rel="manifest" href="%PUBLIC_URL%/manifest.json"/>-->
    <!--
      Notice the use of %PUBLIC_URL% in the tags above.
      It will be replaced with the URL of the `public` folder during the build.
      Only files inside the `public` folder can be referenced from the HTML.

      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
      work correctly both with client-side routing and a non-root public URL.
      Learn how to configure a non-root public URL by running `npm run build`.
    -->
    <title>React App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="app">
    <input type="text" v-model="person.son.name"/>
    <div>
        <h1>我是父亲</h1>
        <div><span>姓名：</span>{{person.name}}</div>
        <div><span>年龄：</span>{{person.age}}</div>
    </div>
    <div>
        {{getSonInfo}}
    </div>
    <div>
        <h1>我是儿子</h1>
        <div><span>姓名：</span>{{person.son.name}}</div>
        <div><span>年龄：</span>{{person.son.age}}</div>
    </div>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>
    <button v-on:click="changeText">更新状态</button>
</div>
<script src="./mvvm.js"></script>
</body>
</html>
